<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>员工信息编辑</title>
  <link rel="stylesheet" href="${pageContext.request.contextPath}/css/add.css">
  <script src="${pageContext.request.contextPath}/js/jquery-3.6.0.js"></script>
</head>
<body>
<div class="container">
  <div class="form-header">
    <h1 id="title">编辑员工信息</h1>
  </div>
  <form id="employeeForm">

    <div class="form-group">
      <label for="id" class="required-field">员工ID</label>
      <input type="number" id="id" name="id" class="form-control" readonly>
    </div>

    <div class="form-group">
      <label for="user_id" class="required-field">用户ID</label>
      <input type="number" id="user_id" name="user_id" class="form-control" required>
      <span class="form-note">外键，关联到users表的id字段</span>
    </div>

    <div class="form-group">
      <label for="name" class="required-field">姓名</label>
      <input type="text" id="name" name="name" class="form-control" maxlength="100" required>
    </div>

    <div class="form-group">
      <label for="position" class="required-field">职位</label>
      <input type="text" id="position" name="position" class="form-control" maxlength="100" required>
    </div>

    <div class="form-group">
      <label for="department" class="required-field">所属部门</label>
      <input type="text" id="department" name="department" class="form-control" maxlength="100" required>
    </div>

    <div class="form-group">
      <label for="hire_date" class="required-field">入职日期</label>
      <input type="date" id="hire_date" name="hire_date" class="form-control" required>
    </div>

    <div class="form-group">
      <label for="leave_date">离职日期</label>
      <input type="date" id="leave_date" name="leave_date" class="form-control">
      <span class="form-note">仅当员工离职时填写</span>
    </div>

    <div class="form-group">
      <label for="status" class="required-field">在职状态</label>
      <select id="status" name="status" class="form-control" required>
        <option value="">-- 请选择 --</option>
        <option value="在职">在职</option>
        <option value="离职">离职</option>
      </select>
    </div>

    <button type="submit" class="btn">提交信息</button>
  </form>
</div>

<script>

  window.onload = function () {
    let id = '${emp.id}';
    if(id != null){
      document.getElementById("title").innerText = "编辑用户";
      document.getElementById("id").style.display = 'block';
      document.getElementById("id").value = id;
      document.getElementById("user_id").value = '${emp.userId}';
      document.getElementById("name").value = '${emp.name}';
      document.getElementById("position").value = '${emp.position}';
      document.getElementById("department").value = '${emp.department}';
      document.getElementById("hire_date").value = '${emp.hireDate}';
      document.getElementById("leave_date").value = '${emp.leaveDate}';
      document.getElementById("status").value = '${emp.status}';
    }
  }

  $(function (){
    getEditEmp();
  })

  function getEditEmp() {
    $('#employeeForm').on('submit', function (e) {
      e.preventDefault();

      // 收集表单数据
      var formData = {
        option: 'update',
        id: $('#id').val(),
        user_id: $('#user_id').val(),
        name: $('#name').val(),
        position: $('#position').val(),
        department: $('#department').val(),
        hire_date: $('#hire_date').val(),
        leave_date: $('#leave_date').val(),
        status: $('#status').val()
      };

      $.ajax({
        url: '${pageContext.request.contextPath}/oa.action',
        type: 'post',
        data: formData,
        dataType: 'json',
        success: function (response) {
          if (response && response.success !== undefined) {
            alert(response.msg || (response.success ? "操作成功" : "操作失败"));
            if (response.success) {
              window.location.href = '${pageContext.request.contextPath}/pages/employee.jsp';
            }
          } else {
            alert("服务器返回异常响应");
          }
        },
        error: function (xhr, status, error) {
          console.error("AJAX请求错误:", status, error);
          alert("请求失败: " + (xhr.responseJSON?.msg || xhr.statusText));
        }
      });
    });
  }
</script>
</body>
</html>
